<template>
  <div class="loufengInfoManagement">
    <h3>楼凤信息管理</h3>
    <div class="tagList tagList2" v-if="permissions_obj.id_182||permissions_obj.id_all">
      <h5>省份</h5>
      <ul>
        <li
          v-for="(item,index) in channelTagList"
          :key="index"
          :class="[channelActiveIndex==index?'active':'']"
          @click="channelSearchTag(item,index)"
        >{{item.province}}</li>
      </ul>
    </div>
    <div class="tagList tagList2" v-if="cityTagList&&cityTagList.length>0">
      <h5>城市</h5>
      <ul>
        <li
          v-for="(item,index) in cityTagList"
          :key="index"
          :class="[cityActiveIndex==index?'active':'']"
          @click="citySearchTag(item,index)"
        >{{item}}</li>
      </ul>
    </div>
    <div class="search">
      <div class="cond1 cond">
        <el-input placeholder="请输入标题" v-model="search1">
          <template slot="prepend">标题</template>
        </el-input>
      </div>
      <div class="cond1 cond">
        <el-input placeholder="请输入ID" v-model="search2">
          <template slot="prepend">ID</template>
        </el-input>
      </div>
      <div class="cond2 cond">
        <label>付费类型</label>
        <el-select v-model="search3" placeholder="请选择">
          <el-option
            v-for="item in optionsPayType"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
      </div>
      <div class="cond2 cond">
        <label>地区状态</label>
        <el-select v-model="search4" placeholder="请选择">
          <el-option
            v-for="item in optionsAreaStatus"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
      </div>
      <div class="cond2 cond">
        <label>状态</label>
        <el-select v-model="search5" placeholder="请选择">
          <el-option
            v-for="item in optionsStatus"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
      </div>
      <div class="cond2 cond">
        <label>有/无图片</label>
        <el-select v-model="search7" placeholder="请选择">
          <el-option
            v-for="item in optionsIsImage"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
      </div>
      <div class="cond2 cond">
        <label>上/下架时间</label>
        <el-date-picker
          v-model="search6"
          type="daterange"
          align="right"
          unlink-panels
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          :picker-options="pickerOptions"
          value-format="yyyy-MM-dd"
        ></el-date-picker>
      </div>
      <div>
        <el-button type="primary" icon="el-icon-search" @click="searchMethod">搜索</el-button>
      </div>
    </div>
    <div class="opration">
      <el-button
        type="success"
        icon="el-icon-plus"
        @click="addData"
        v-if="permissions_obj.id_184||permissions_obj.id_all"
      >添加</el-button>
      <el-button
        type="primary"
        @click="batchUp"
        v-if="permissions_obj.id_188||permissions_obj.id_all"
      >批量上架</el-button>
      <el-button
        type="warning"
        @click="batchDown"
        v-if="permissions_obj.id_189||permissions_obj.id_all"
      >批量下架</el-button>
      <el-button
        type="danger"
        @click="batchDelete"
        v-if="permissions_obj.id_190||permissions_obj.id_all"
      >批量删除</el-button>
    </div>
    <div class="list">
      <el-table
        border
        ref="multipleTable"
        :data="tableData"
        tooltip-effect="dark"
        style="width: 100%"
        @selection-change="handleSelectionChange"
      >
        <el-table-column type="selection" width="45" header-align="center" align="center"></el-table-column>
        <el-table-column type="index" width="50" header-align="center" align="center" label="序号"></el-table-column>
        <el-table-column header-align="center" align="center" label="图片" width="100">
          <template slot-scope="scope">
            <div
              class="left"
              style="width: 80px; height: 80px"
              v-if="scope.row.images&&scope.row.images.length>0"
            >
              <el-image
                style="width: 100px; height: 100px"
                :src="scope.row.images[0]"
                :preview-src-list="scope.row.images"
              ></el-image>
            </div>
            <div v-else>无图片</div>
          </template>
        </el-table-column>
        <el-table-column header-align="center" align="center" label="楼凤信息">
          <template slot-scope="scope">
            <div class="vedioBox">
              <div class="right">
                <div>
                  ID：
                  <span>{{scope.row.id}}</span>
                </div>
                <div>
                  标题：
                  <span>{{scope.row.title}}</span>
                </div>
                <div>
                  人数：
                  <span>{{scope.row.people}}</span>
                </div>
                <div>
                  年龄：
                  <span>{{scope.row.age}}</span>
                </div>
              </div>
            </div>
          </template>
        </el-table-column>
        <el-table-column header-align="center" align="center" label="省市区" width="90">
          <template slot-scope="scope">
            <span>{{scope.row.province}}{{scope.row.city}}</span>
          </template>
        </el-table-column>
        <el-table-column
          header-align="center"
          align="center"
          prop="serving_money"
          label="价格"
          width="90"
        ></el-table-column>
        <el-table-column
          header-align="center"
          align="center"
          prop="contact"
          label="联系方式"
          width="90"
        ></el-table-column>
        <el-table-column
          header-align="center"
          align="center"
          prop="serving"
          label="服务项目"
          width="90"
        ></el-table-column>
        <el-table-column
          header-align="center"
          align="center"
          prop="quality"
          label="MM质量"
          width="90"
        ></el-table-column>
        <el-table-column
          header-align="center"
          align="center"
          prop="paytype_zh"
          label="付费类型"
          width="90"
        ></el-table-column>
        <el-table-column
          header-align="center"
          align="center"
          prop="like_count"
          label="点赞量"
          width="90"
        ></el-table-column>
        <el-table-column
          header-align="center"
          align="center"
          prop="pay_count"
          label="购买量"
          width="90"
        ></el-table-column>
        <el-table-column
          header-align="center"
          align="center"
          prop="created_at"
          label="上/下架时间"
          width="90"
        ></el-table-column>
        <el-table-column header-align="center" align="center" label="操作" width="230" fixed="right">
          <template slot-scope="scope">
            <el-button
              size="mini"
              type="danger"
              v-show="scope.row.status==1"
              v-if="permissions_obj.id_187||permissions_obj.id_all"
              @click="handleTakeOff(scope.$index, scope.row)"
            >下架</el-button>
            <el-button
              size="mini"
              type="success"
              @click="handleShelves(scope.$index, scope.row)"
              v-show="scope.row.status==0"
              v-if="permissions_obj.id_187||permissions_obj.id_all"
            >上架</el-button>
            <el-button
              size="mini"
              type="primary"
              @click="handleModify(scope.$index, scope.row)"
              v-if="permissions_obj.id_185||permissions_obj.id_all"
            >详情</el-button>
            <el-button
              size="mini"
              type="danger"
              @click="handleDelete(scope.$index, scope.row)"
              v-if="permissions_obj.id_186||permissions_obj.id_all"
            >删除</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <div class="page">
      <el-pagination
        background
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page.sync="currentPage1"
        :page-sizes="[10,30,50,100]"
        :page-size="pageSize"
        layout="total, prev, pager, next,sizes,jumper"
        :total="totalSize"
      ></el-pagination>
    </div>
    <!-- //添加楼凤信息 -->
    <el-dialog title="添加楼风信息" :visible.sync="addDialogVisible" width="40%" center class="dialog">
      <!-- <div class="row" v-if="dialogTitle=='私照详情'">
        <span>ID：</span>
        <el-input placeholder="请输入标题" v-model="inputId" clearable disabled></el-input>
      </div>-->
      <div class="row">
        <span>省市：</span>
        <el-input placeholder="请输入省份" v-model="inputProvince" clearable></el-input>
        <el-input placeholder="请输入市区" v-model="inputCity" clearable></el-input>
        <!-- <el-select v-model="inputProvince" placeholder="省份" @change="changeProvince">
          <el-option
            v-for="item in optionsProvince"
            :key="item.province"
            :label="item.province"
            :value="item.province"
          ></el-option>
        </el-select>-->
        <!-- <el-select v-model="inputCity" placeholder="市区">
          <el-option v-for="item in optionsCity" :key="item" :label="item" :value="item"></el-option>
        </el-select>-->
      </div>
      <div class="row">
        <span>标题：</span>
        <el-input placeholder="请输入标题" v-model="inputTitle" clearable type="textarea"></el-input>
      </div>
      <div class="row">
        <span>MM人数：</span>
        <el-input placeholder="请输入人数" v-model="inputPeopleNum" clearable></el-input>
      </div>
      <div class="row">
        <span>MM年龄：</span>
        <el-input placeholder="请输入年龄" v-model="inputAge" clearable></el-input>
      </div>
      <div class="row">
        <span>价格：</span>
        <el-input placeholder="多个内容用 , 半角逗号隔开" v-model="inputPrices" clearable></el-input>
      </div>
      <div class="row">
        <span>联系方式：</span>
        <el-input placeholder="多个内容用 , 半角逗号隔开" v-model="inputContacts" clearable></el-input>
      </div>
      <div class="row">
        <span>服务项目：</span>
        <el-input placeholder="多个内容用 , 半角逗号隔开" v-model="inputServiceItems" clearable></el-input>
      </div>
      <div class="row">
        <span>付费类型：</span>
        <el-select v-model="inputPayType" placeholder="请选择">
          <el-option
            v-for="item in optionsDialogPayType"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          ></el-option>
        </el-select>
      </div>
      <div class="row" v-if="inputPayType==2">
        <span>价格：</span>
        <el-input placeholder="请输入钻石价格" v-model="inputDiamondPrice" clearable></el-input>
      </div>
      <div class="row">
        <span>照片：</span>
        <el-upload
          :action="imgUploadParth"
          list-type="picture-card"
          :on-preview="handlePictureCardPreview"
          :on-remove="handleRemove"
          :on-success="imgUploadSuccess"
          :on-error="imgUploadFailure"
          :file-list="fileList"
          multiple
        >
          <i class="el-icon-plus"></i>
        </el-upload>
        <el-dialog :visible.sync="dialogVisible" append-to-body>
          <img width="100%" :src="dialogImageUrl" alt />
        </el-dialog>
      </div>
      <div class="row">
        <span>环境：</span>
        <el-input placeholder="请输入环境" v-model="inputEnv" clearable type="textarea"></el-input>
      </div>
      <div class="row">
        <span>MM质量：</span>
        <el-input placeholder="请输入MM质量" v-model="inputMMQuality" clearable type="textarea"></el-input>
      </div>
      <div class="row">
        <span>服务介绍：</span>
        <el-input placeholder="请输入服务介绍" v-model="inputServiceIntro" clearable type="textarea"></el-input>
      </div>
      <div class="dialogBtn">
        <el-button type="primary" size="small" @click="submitAdd">提交</el-button>
        <el-button type="info" size="small" @click="cancelAdd">取消</el-button>
      </div>
    </el-dialog>
    <!-- //编辑楼凤信息 -->
    <el-dialog title="楼凤信息详情" :visible.sync="modifyDialogVisible" width="80%" center class="dialog">
      <div class="dialogContent">
        <div class="dialogLeft">
          <div class="dialogLeft_in">
            <div>采集的信息：</div>
            <div v-html="info"></div>
          </div>
        </div>
        <div class="dialogRight">
          <div class="row">
            <span>ID：</span>
            <el-input placeholder="请输入标题" v-model="inputId" clearable disabled></el-input>
          </div>
          <div class="row">
            <span>省市：</span>
            <el-input placeholder="请输入省份" v-model="inputProvince" clearable></el-input>
            <el-input placeholder="请输入市区" v-model="inputCity" clearable></el-input>
            <!-- <el-select v-model="inputProvince" placeholder="省份">
              <el-option
                v-for="item in optionsProvince"
                :key="item.province"
                :label="item.province"
                :value="item.province"
              ></el-option>
            </el-select>
            <el-select v-model="inputCity" placeholder="市区">
              <el-option v-for="item in optionsCity" :key="item" :label="item" :value="item"></el-option>
            </el-select>-->
          </div>
          <div class="row">
            <span>标题：</span>
            <el-input placeholder="请输入标题" v-model="inputTitle" clearable type="textarea"></el-input>
          </div>
          <div class="row">
            <span>MM人数：</span>
            <el-input placeholder="请输入人数" v-model="inputPeopleNum" clearable></el-input>
          </div>
          <div class="row">
            <span>MM年龄：</span>
            <el-input placeholder="请输入年龄" v-model="inputAge" clearable></el-input>
          </div>
          <div class="row">
            <span>价格：</span>
            <el-input placeholder="多个内容用 , 半角逗号隔开" v-model="inputPrices" clearable></el-input>
          </div>
          <div class="row">
            <span>联系方式：</span>
            <el-input placeholder="多个内容用 , 半角逗号隔开" v-model="inputContacts" clearable></el-input>
          </div>
          <div class="row">
            <span>服务项目：</span>
            <el-input placeholder="多个内容用 , 半角逗号隔开" v-model="inputServiceItems" clearable></el-input>
          </div>
          <div class="row">
            <span>付费类型：</span>
            <el-select v-model="inputPayType" placeholder="请选择">
              <el-option
                v-for="item in optionsDialogPayType"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </div>
          <div class="row" v-if="inputPayType==2">
            <span>价格：</span>
            <el-input placeholder="请输入钻石价格" v-model="inputDiamondPrice" clearable></el-input>
          </div>
          <div class="row">
            <span>照片：</span>
            <el-upload
              :action="imgUploadParth"
              list-type="picture-card"
              :on-preview="handlePictureCardPreview"
              :on-remove="handleRemove"
              :on-success="imgUploadSuccess"
              :on-error="imgUploadFailure"
              :file-list="fileList"
              multiple
            >
              <i class="el-icon-plus"></i>
            </el-upload>
            <el-dialog :visible.sync="dialogVisible" append-to-body>
              <img width="100%" :src="dialogImageUrl" alt />
            </el-dialog>
          </div>
          <div class="row">
            <span>环境：</span>
            <el-input placeholder="请输入环境" v-model="inputEnv" clearable type="textarea"></el-input>
          </div>
          <div class="row">
            <span>MM质量：</span>
            <el-input placeholder="请输入MM质量" v-model="inputMMQuality" clearable type="textarea"></el-input>
          </div>
          <div class="row">
            <span>服务介绍：</span>
            <el-input placeholder="请输入服务介绍" v-model="inputServiceIntro" clearable type="textarea"></el-input>
          </div>
          <div class="dialogBtn">
            <el-button type="primary" size="small" @click="submitModifyEditor">提交</el-button>
            <el-button type="info" size="small" @click="cancelModifyEditor">取消</el-button>
          </div>
        </div>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import md5 from "js-md5";
export default {
  name: "loufengInfoManagement",
  data() {
    return {
      channelTagList: [],
      channelActiveIndex: 0,
      channelActiveText: "",
      cityTagList: [],
      cityActiveIndex: 0,
      cityActiveText: "",
      search1: "",
      search2: "",
      search3: "",
      search4: "",
      search5: "",
      search6: "",
      search7: "",
      optionsPayType: [
        {
          value: "",
          label: "全部"
        },
        {
          value: 1,
          label: "VIP"
        },
        {
          value: 2,
          label: "钻石"
        },
        {
          value: 3,
          label: "免费"
        }
      ],
      optionsAreaStatus: [
        {
          value: "",
          label: "全部"
        },
        {
          value: 1,
          label: "有地区"
        },
        {
          value: 2,
          label: "无地区"
        }
      ],
      optionsStatus: [
        {
          value: "",
          label: "全部"
        },
        {
          value: 0,
          label: "下架"
        },
        {
          value: 1,
          label: "上架"
        }
      ],
      optionsDialogPayType: [
        {
          value: 1,
          label: "VIP"
        },
        {
          value: 2,
          label: "钻石"
        },
        {
          value: 3,
          label: "免费"
        }
      ],
      optionsIsImage: [
        {
          value: "",
          label: "全部"
        },
        {
          value: 0,
          label: "无图片"
        },
        {
          value: 1,
          label: "有图片"
        }
      ],
      pickerOptions: {
        shortcuts: [
          {
            text: "最近一周",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "最近一个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
              picker.$emit("pick", [start, end]);
            }
          },
          {
            text: "最近三个月",
            onClick(picker) {
              const end = new Date();
              const start = new Date();
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
              picker.$emit("pick", [start, end]);
            }
          }
        ]
      },
      optionsProvince: [],
      optionsCity: [],
      currentPage1: 1,
      pageSize: 10,
      totalSize: 0,
      //多选框选中的值
      multipleSelection: [],
      initData: {},
      addDialogVisible: false,
      modifyDialogVisible: false,
      //弹窗输入框
      inputId: "",
      inputProvince: "",
      inputCity: "",
      inputTitle: "",
      inputPeopleNum: "",
      inputAge: "",
      inputPrices: "",
      inputContacts: "",
      inputServiceItems: "",
      inputPayType: "",
      inputDiamondPrice: "",
      inputEnv: "",
      inputMMQuality: "",
      inputServiceIntro: "",
      //图片上传成功返回地址
      uploadImg: "",
      //图片上传接口地址
      imgUploadParth: "",
      fileList: [],
      images: [],
      //提交时，传给后台的图片列表
      uploadImgList: [],
      //图片预览
      dialogVisible: false,
      //图片预览列表
      dialogImageUrl: [],
      tableData: [],
      selectId: "",
      info: "",
      // 权限管理
      permissions: [],
      permissions_obj: {}
    };
  },
  watch: {
    inputProvince() {
      this.changeProvince(this.inputProvince);
    }
  },
  created() {
    //权限判断
    this.permissions = this.$store.state.permissions;
    let oneOff = false;
    this.permissions.forEach((item, index) => {
      if (item == -1) {
        oneOff = true;
      } else {
        this.permissions_obj["id_" + item] = item;
      }
    });
    if (oneOff) {
      this.permissions_obj.id_all = true;
    } else {
      this.permissions_obj.id_all = false;
    }
  },
  mounted() {
    this.getFileUploadParth();
    this.getChannelList();
    this.getInitData();
  },
  methods: {
    //   分类标签搜索
    channelSearchTag(item, index) {
      this.channelActiveIndex = index;
      this.channelActiveText = item.province;
      this.cityActiveText = "";
      this.cityTagList = item.son_city;
      this.getInitData();
    },
    citySearchTag(item, index) {
      this.cityActiveIndex = index;
      this.cityActiveText = item;
      this.getInitData();
    },
    // 添加弹窗省份切换
    changeProvince(val) {
      this.optionsProvince.forEach((item, index) => {
        if (item.province == val) {
          this.optionsCity = item.son_city;
        }
      });
    },
    //获取分类标签
    async getChannelList() {
      let parames = {
        handshake: "",
        data: {}
      };
      let res = await this.$axios.post(
        this.$api.floorTypes,
        JSON.stringify(parames)
      );
      if (res.code == 200) {
        let data = res.data;
        this.channelTagList = data;
        this.optionsProvince = JSON.parse(JSON.stringify(data));
        this.channelTagList.forEach((item, index) => {
          item.son_city.unshift("全部");
        });
        this.channelTagList.unshift({
          province: "全部",
          son_city: []
        });
        this.channelActiveText = this.channelTagList[0].province;
        this.getInitData();
      } else {
        this.$message({
          message: res.message,
          type: "warning"
        });
      }
    },
    // 分页
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
      this.currentPage1 = val;
      this.getInitData();
    },
    handleSizeChange(val) {
      this.pageSize = val;
      this.getInitData();
    },
    //多选框选中
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    //搜索
    searchMethod() {
      this.currentPage1 = 1;
      this.getInitData();
    },
    //添加
    addData() {
      this.addDialogVisible = true;
      this.fileList = [];
      this.inputId = "";
      this.inputProvince = "";
      this.inputCity = "";
      this.inputTitle = "";
      this.inputPeopleNum = "";
      this.inputAge = "";
      this.inputPrices = "";
      this.inputContacts = "";
      this.inputServiceItems = "";
      this.inputPayType = "";
      this.inputDiamondPrice = "";
      this.inputEnv = "";
      this.inputMMQuality = "";
      this.inputServiceIntro = "";
    },
    //批量上架
    async batchUp() {
      if (this.multipleSelection.length < 1) {
        this.$message({
          message: "至少选择一项",
          type: "warning"
        });
        return;
      }
      let idList = [];
      this.multipleSelection.forEach((item, index) => {
        idList.push(item.id);
      });
      let parames = {
        handshake: "",
        data: {
          ids: idList.join(",")
        }
      };
      let res = await this.$axios.post(
        this.$api.floorSet_status_up,
        JSON.stringify(parames)
      );
      if (res.code == 200) {
        this.$message({
          message: res.message,
          type: "success"
        });
        this.getInitData();
      } else {
        this.$message({
          message: res.message,
          type: "warning"
        });
      }
    },
    //批量下架
    async batchDown() {
      if (this.multipleSelection.length < 1) {
        this.$message({
          message: "至少选择一项",
          type: "warning"
        });
        return;
      }
      let idList = [];
      this.multipleSelection.forEach((item, index) => {
        idList.push(item.id);
      });
      let parames = {
        handshake: "",
        data: {
          ids: idList.join(",")
        }
      };
      let res = await this.$axios.post(
        this.$api.floorSet_status_down,
        JSON.stringify(parames)
      );
      if (res.code == 200) {
        this.$message({
          message: res.message,
          type: "success"
        });
        this.getInitData();
      } else {
        this.$message({
          message: res.message,
          type: "warning"
        });
      }
    },
    //批量删除
    async batchDelete() {
      if (this.multipleSelection.length < 1) {
        this.$message({
          message: "至少选择一项",
          type: "warning"
        });
        return;
      }
      let idList = [];
      this.multipleSelection.forEach((item, index) => {
        idList.push(item.id);
      });
      let parames = {
        handshake: "",
        data: {
          ids: idList.join(",")
        }
      };
      let res = await this.$axios.post(
        this.$api.floorDelete_more,
        JSON.stringify(parames)
      );
      if (res.code == 200) {
        this.$message({
          message: res.message,
          type: "success"
        });
        this.getInitData();
      } else {
        this.$message({
          message: res.message,
          type: "warning"
        });
      }
    },
    //下架
    handleTakeOff(index, row) {
      this.selectId = row.id;
      this.$confirm("是否继续该操作?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.statusMethod(0);
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消该操作"
          });
        });
    },
    //上架
    handleShelves(index, row) {
      this.selectId = row.id;
      this.$confirm("是否继续该操作?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.statusMethod(1);
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消该操作"
          });
        });
    },
    //上/下架接口
    async statusMethod(status) {
      let parames = {
        handshake: "",
        data: {
          id: this.selectId,
          status: status
        }
      };
      let res = await this.$axios.post(
        this.$api.floorSet_status,
        JSON.stringify(parames)
      );
      if (res.code == 200) {
        this.$message({
          message: res.message,
          type: "success"
        });
        this.getInitData();
      } else {
        this.$message({
          message: res.message,
          type: "warning"
        });
      }
    },
    //修改
    handleModify(index, row) {
      this.info = row.intro;
      this.modifyDialogVisible = true;
      this.fileList = [];
      this.inputId = row.id;
      this.inputProvince = row.province;
      this.inputCity = row.city;
      this.inputTitle = row.title;
      this.inputPeopleNum = row.people;
      this.inputAge = row.age;
      this.inputPrices = row.serving_money;
      this.inputContacts = row.contact;
      this.inputServiceItems = row.serving;
      this.inputPayType = row.paytype;
      this.inputDiamondPrice = row.coins;
      this.inputEnv = row.milieu;
      this.inputMMQuality = row.quality;
      this.inputServiceIntro = row.serving_intro;
      row.images.forEach((item, index) => {
        this.fileList.push({
          name: index,
          url: item
        });
      });
    },
    //删除
    handleDelete(index, row) {
      this.selectId = row.id;
      this.$confirm("是否继续该操作?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(() => {
          this.deleteMethod();
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消该操作"
          });
        });
    },
    async deleteMethod() {
      let parames = {
        handshake: "",
        data: {
          id: this.selectId
        }
      };
      let res = await this.$axios.post(
        this.$api.floorDelete,
        JSON.stringify(parames)
      );
      if (res.code == 200) {
        this.$message({
          message: res.message,
          type: "success"
        });
        this.getInitData();
      } else {
        this.$message({
          message: res.message,
          type: "warning"
        });
      }
    },
    //获取初始化数据列表
    async getInitData() {
      let parames = {
        handshake: "",
        data: {
          page: this.currentPage1,
          page_size: this.pageSize,
          search: {
            province:
              this.channelActiveText == "全部" ? "" : this.channelActiveText,
            city: this.cityActiveText == "全部" ? "" : this.cityActiveText,
            title: this.search1,
            id: this.search2,
            paytype: this.search3,
            is_city: this.search4,
            status: this.search5,
            stime:
              this.search6 && this.search6.length > 0 ? this.search6[0] : "",
            otime:
              this.search6 && this.search6.length > 1 ? this.search6[1] : "",
            is_images: this.search7,
          }
        }
      };
      let res = await this.$axios.post(
        this.$api.floorLists,
        JSON.stringify(parames)
      );
      if (res.code == 200) {
        this.initData = res.data;
        this.totalSize = this.initData.total;
        this.tableData = this.initData.data;
      } else {
        this.$message({
          message: res.message,
          type: "warning"
        });
      }
    },
    //图片上传成功
    imgUploadSuccess(response, file, fileList) {
      this.$message({
        message: "上传成功",
        type: "success"
      });
      this.uploadImg = response.result.file_path;
      this.images = fileList;
    },
    //图片上传失败
    imgUploadFailure(err, file, fileList) {
      this.$message({
        message: "上传失败",
        type: "warning"
      });
    },
    //图片预览
    handlePictureCardPreview(file) {
      this.dialogImageUrl = file.url;
      this.dialogVisible = true;
    },
    handleRemove(file, fileList) {
      this.images = fileList;
    },
    //获取文件上传地址
    async getFileUploadParth() {
      let parames = {
        handshake: "",
        data: {}
      };
      let res = await this.$axios.post(
        this.$api.uploadGet_domain,
        JSON.stringify(parames)
      );
      if (res.code == 200) {
        let timestamp = parseInt(new Date().getTime() / 1000);
        let platform = "P";
        let secret = "Z6Kbz8hpT9VtGmcu";
        let sign = md5(platform + timestamp + secret).toUpperCase();

        this.imgUploadParth =
          res.data.url +
          "?dir=floor&platform=P&timestamp=" +
          timestamp +
          "&sign=" +
          sign;
      } else {
        this.$message({
          message: res.message,
          type: "warning"
        });
      }
    },
    //提交添加
    async submitAdd() {
      console.log(this.fileList);
      let images = [];
      this.images.forEach((item, index) => {
        images.push(item.response.result.file_path);
      });
      let parames = {
        handshake: "",
        data: {
          province: this.inputProvince,
          city: this.inputCity,
          title: this.inputTitle,
          people: this.inputPeopleNum,
          age: this.inputAge,
          serving_money: this.inputPrices,
          contact: this.inputContacts,
          serving: this.inputServiceItems,
          paytype: this.inputPayType,
          coins: this.inputPayType==2?this.inputDiamondPrice:0,
          images: images.join(","),
          milieu: this.inputEnv,
          quality: this.inputMMQuality,
          serving_intro: this.inputServiceIntro
        }
      };
      let res = await this.$axios.post(
        this.$api.floorAdd,
        JSON.stringify(parames)
      );
      if (res.code == 200) {
        this.$message({
          message: res.message,
          type: "success"
        });
        this.getInitData();
        this.addDialogVisible = false;
      } else {
        this.$message({
          message: res.message,
          type: "warning"
        });
      }
    },
    //取消提交
    cancelAdd() {
      this.addDialogVisible = false;
    },
    //提交修改
    async submitModifyEditor() {
      console.log(this.fileList);
      let images = [];
      this.images.forEach((item, index) => {
        if (item.response) {
          images.push(item.response.result.file_path);
        } else if (item.url) {
          let index = item.url.indexOf("ig");
          let newUrl = "";
          if (index) {
            newUrl = item.url.substring(index);
            let _ind = newUrl.indexOf(".", -1);
            if (_ind) {
              newUrl = newUrl.substring(0, _ind);
              newUrl = "/" + newUrl + ".ceb";
            }
          }
          images.push(newUrl);
        }
      });
      let parames = {
        handshake: "",
        data: {
          id: this.inputId,
          province: this.inputProvince,
          city: this.inputCity,
          title: this.inputTitle,
          people: this.inputPeopleNum,
          age: this.inputAge,
          serving_money: this.inputPrices,
          contact: this.inputContacts,
          serving: this.inputServiceItems,
          paytype: this.inputPayType,
          coins: this.inputPayType==2?this.inputDiamondPrice:0,
          images: images.join(","),
          milieu: this.inputEnv,
          quality: this.inputMMQuality,
          serving_intro: this.inputServiceIntro
        }
      };
      let res = await this.$axios.post(
        this.$api.floorUpdate,
        JSON.stringify(parames)
      );
      if (res.code == 200) {
        this.$message({
          message: res.message,
          type: "success"
        });
        this.getInitData();
        this.modifyDialogVisible = false;
      } else {
        this.$message({
          message: res.message,
          type: "warning"
        });
      }
    },
    cancelModifyEditor() {
      this.modifyDialogVisible = false;
    }
  }
};
</script>
<style scoped>
.loufengInfoManagement {
  padding-bottom: 0.2rem;
}
.tagList {
  width: 1.4rem;
}
.tagList ul {
  display: flex;
  align-items: center;
  width: 100%;
}
.tagList li {
  background: rgb(26, 153, 226);
  color: #fff;
  cursor: pointer;
  height: 0.4rem;
  width: 0.7rem;
  text-align: center;
  line-height: 0.4rem;
  margin-bottom: 0.1rem;
}
.tagList li:hover {
  background: rgb(52, 169, 236);
}
.tagList .active {
  background: rgb(52, 169, 236);
}
.tagList2 {
  width: 100%;
  padding: 0 0.2rem;
  margin-bottom: 0.2rem;
}
.tagList2 ul {
  flex-wrap: wrap;
}
.tagList2 li {
  border-radius: 3px;
  margin-right: 0.1rem;
  height: 0.3rem;
  line-height: 0.3rem;
  width: auto;
  padding: 0px 10px;
  display: flex;
  background: rgb(26, 213, 226);
}
.tagList2 li:hover {
  background: rgb(25, 168, 179);
}
.tagList2 .active {
  background: rgb(25, 168, 179);
}

h3 {
  padding: 0.2rem;
  color: #3c763d;
}
h5 {
  margin-bottom: 0.1rem;
}
.search {
  display: flex;
  margin-top: 0.2rem;
  padding-left: 0.2rem;
  width: 100%;
  flex-wrap: wrap;
}
.el-input {
  width: 2.5rem;
}
.search label {
  width: 0.83rem;
  height: 0.4rem;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #f5f7fa;
  color: #909399;
  border: 1px solid #dcdfe6;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
  font-size: 14px;
}
.cond {
  display: flex;
  margin-right: 0.4rem;
  margin-bottom: 0.1rem;
}
.search .el-select >>> .el-input__inner {
  border-left: none;
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
}
.search .el-select {
  width: 1.67rem;
}
.opration {
  margin-top: 0.2rem;
  padding-left: 0.2rem;
}
.page {
  margin-top: 0.2rem;
  display: flex;
  justify-content: center;
}
.list {
  margin-top: 0.2rem;
  padding: 0 0.1rem;
  font-size: 0.12rem;
}
.dialogBtn {
  display: flex;
  justify-content: center;
  margin-top: 0.3rem;
}
.row {
  margin-bottom: 0.1rem;
  display: flex;
  align-items: center;
}
.row span {
  width: 1rem;
  display: block;
}
.row >>> .avatar-uploader .el-upload {
  border: 1px dashed #d9d9d9;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}
.row >>> .avatar-uploader .el-upload:hover {
  border-color: #409eff;
}
.row >>> .avatar-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  width: 178px;
  height: 178px;
  line-height: 178px;
  text-align: center;
}
.row >>> .avatar {
  width: 178px;
  height: 178px;
  display: block;
}
.el-checkbox-group {
  width: 90%;
}
.vedioBox {
  display: flex;
  align-items: center;
}
.vedioBox .right {
  display: flex;
  justify-content: flex-start;
  flex-direction: column;
  align-items: flex-start;
  padding-left: 0.05rem;
}
.vedioBox .right span {
  color: rgb(19, 141, 150);
}
.el-button {
  margin-bottom: 10px;
}
.dialog .el-input {
  width: 100%;
}
.playList {
  display: flex;
  justify-content: flex-start;
  margin-top: 0.15rem;
}
.dialogContent {
  display: flex;
  width: 100%;
}
.dialogContent > div {
  width: 50%;
}
.dialogLeft {
  padding-right: 0.1rem;
  height: 8rem;
  overflow-y: auto;
}
</style>